mjml-core

What is mjml-core?

The mjml-core package is a framework for creating responsive email templates using a markup language called MJML (Mailjet Markup Language). It simplifies the process of designing and coding responsive emails by providing a set of high-level components that abstract away the complexities of HTML and CSS.

What are mjml-core's main functionalities?

Basic MJML to HTML Conversion

This feature allows you to convert MJML markup into responsive HTML. The code sample demonstrates how to use the `mjml2html` function to convert a simple MJML template into HTML.

const mjml2html = require('mjml');

const mjml = `
<mjml>
  <mj-body>
    <mj-section>
      <mj-column>
        <mj-text>Hello World</mj-text>
      </mj-column>
    </mj-section>
  </mj-body>
</mjml>`;

const { html, errors } = mjml2html(mjml);
console.log(html);

Custom Components

This feature allows you to create custom MJML components. The code sample demonstrates how to create and register a custom button component.

const { registerComponent, BodyComponent } = require('mjml-core');

class CustomButton extends BodyComponent {
  render() {
    return this.renderMJML(`
      <mj-button background-color="${this.getAttribute('background-color')}" href="${this.getAttribute('href')}">
        ${this.getContent()}
      </mj-button>
    `);
  }
}

registerComponent(CustomButton);

Validation

This feature provides validation for MJML templates. The code sample demonstrates how to use the `mjml2html` function with strict validation to catch any errors in the MJML markup.

const mjml2html = require('mjml');

const mjml = `
<mjml>
  <mj-body>
    <mj-section>
      <mj-column>
        <mj-text>Hello World</mj-text>
      </mj-column>
    </mj-section>
  </mj-body>
</mjml>`;

const { html, errors } = mjml2html(mjml, { validationLevel: 'strict' });

if (errors.length > 0) {
  console.error('Validation errors:', errors);
} else {
  console.log(html);
}

Other packages similar to mjml-core

handlebars

Handlebars is a popular templating engine that allows you to build dynamic HTML templates. Unlike MJML, which is specifically designed for responsive email templates, Handlebars is more general-purpose and can be used for a variety of web development tasks.

pug

Pug (formerly known as Jade) is a high-performance template engine heavily influenced by Haml and implemented with JavaScript for Node.js and browsers. While Pug is not specifically designed for email templates, it offers a powerful syntax for generating HTML.

nunjucks

Nunjucks is a rich and powerful templating language for JavaScript. It is heavily inspired by Jinja2, the templating engine for Python. Nunjucks is not specifically tailored for email templates but offers a lot of flexibility for general HTML generation.

README

mjml-core

Installation

npm install --save mjml-core

This is the core mjml library, composed by a set of functions for both parsing, and rendering mjml

Usage

import { mjml2html } from 'mjml'

console.log(mjml2html(`code`))